// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('container'));

var colors = ['#5793f3', '#d14a61'];

option = {
    color: colors,

    tooltip: {
        trigger: 'none',
        axisPointer: {
            type: 'cross'
        }
    },
    legend: {
        data: ["", ""]
    },
    grid: {
        top: 70,
        bottom: 50
    },
    xAxis: [
        {
            type: 'category',
            axisTick: {
                alignWithLabel: true
            },
            axisLine: {
                onZero: false,
                lineStyle: {
                    color: colors[1]
                }
            },
            axisPointer: {
                label: {
                    formatter: function (params) {
                        console.log(params.seriesData.length);
                        return '出行人数  ' + params.value
                            + (params.seriesData.length ? '：' + params.seriesData[0].data : '');
                    }
                }
            },
            data: ['00:00', '01:00', '02:00', '03:00', '04:00', '05:00', '06:00', '07:00', '08:00', '09:00', '10:00', '11:00',
                '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00', '19:00', '20:00', '21:00', '22:00', '23:00']
        },
        {
            type: 'category',
            axisTick: {
                alignWithLabel: true
            },
            axisLine: {
                onZero: false,
                lineStyle: {
                    color: colors[0]
                }
            },
            axisPointer: {
                label: {
                    formatter: function (params) {
                        console.log(params.seriesData.length);
                        return '出行人数预测  ' + params.value
                            + (params.seriesData.length ? '：' + params.seriesData[0].data : '');
                    }
                }
            },
            data: ['00:00', '01:00', '02:00', '03:00', '04:00', '05:00', '06:00', '07:00', '08:00', '09:00', '10:00', '11:00',
                '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00', '19:00', '20:00', '21:00', '22:00', '23:00']
        }
    ],
    yAxis: [
        {
            type: 'value'
        }
    ],
    series: [
        {
            name: '',
            type: 'line',
            xAxisIndex: 1,
            smooth: true,
            data: []
        },
        {
            name: '',
            type: 'line',
            smooth: true,
            data: []
        }
    ]
};
// myChart.setOption(option);
function getData() {
    $.ajax({
        type: "GET",
        url: '/CurrentData',
        success: function (currentData) {

            $.ajax({
                type: "GET",
                url: '/PredictData',
                success: function (predictDate) {
                    let cur = new Array(24), pre = new Array(24);
                    let curStart = parseInt(currentData[0].time.substring(8, 10), 10),
                        preStart = parseInt(predictDate[0].time.substring(8, 10), 10);

                    console.log(curStart, preStart);

                    option.legend.data[0] = currentData[0].time.substring(4, 6) + "月" + currentData[0].time.substring(6, 8) + "日出行人数预测";
                    option.series[0].name = currentData[0].time.substring(4, 6) + "月" + currentData[0].time.substring(6, 8) + "日出行人数预测";
                    option.legend.data[1] = predictDate[0].time.substring(4, 6) + "月" + predictDate[0].time.substring(6, 8) + "日出行人数";
                    option.series[1].name = predictDate[0].time.substring(4, 6) + "月" + predictDate[0].time.substring(6, 8) + "日出行人数";

                    for (let i = curStart; i < curStart + currentData.length; i++) {
                        cur[i] = currentData[i - curStart].count;
                    }

                    for (let i = preStart; i < preStart + predictDate.length; i++) {
                        pre[i] = predictDate[i - preStart].count;
                    }

                    // 使用刚指定的配置项和数据显示图表。
                    option.series[0].data = pre;
                    option.series[1].data = cur;
                    myChart.setOption(option);
                },
                cache: false
            });
        },
        cache: false
    });

}
getData();
setInterval(getData, 5000);